<template>
    <!-- 左侧页面 -->
    <PageLeft />
    <!-- 右侧面板 -->
    <PageRight />
    <!-- 右侧导航条 -->
    <LayoutToolsBar />
    <!-- 工具-layer面板 只能使用v-show,不然会触发图层的重复选中和渲染 -->
    <LayerToolPanel v-show="globalStore.currentTool === 'layer'" />
    <!-- 弹窗 -->
     <component :is="activePop"  />
</template>

<script setup lang="ts">
import PageLeft from './components/PageLeft.vue'
import PageRight from './components/PageRight.vue'
import LayoutToolsBar from '@/components/LayoutToolsBar/index.vue'
import LayerToolPanel from './components/tool/LayerToolPanel.vue'
import { useGlobalStore } from '@/store/global'
import Pops from './components/pop/index'

// 全局数据
const globalStore = useGlobalStore()
globalStore.resetRegionAndGrid()

const activePop = computed(() => {    
  return Pops.find(pop => pop.name === globalStore.currentPopName)?.component || null
})
</script>
